p{
    text-shadow: #000000 1px 1px 1px;
    font-family: 幼圆;
}
#me>h4{
     font-size: 20px;
     font-family: 幼圆;
     height: 30px;
     line-height: 30px;
     font-weight: bold;
     color: black;
}
#me>h3{
    color: white;
    font-weight: bold;
    font-family: 幼圆;
    text-shadow: #000000 1px 1px 1px;
}
#me>p{
    font-size: 18px;
    color: white;
}
#job>h4{
    font-size: 20px;
    font-family:幼圆;
    height: 30px;
    line-height: 30px;
    font-weight: bold;
    color: black;
}
#job>h3{
    color: white;
    font-weight: bold;
    font-family: 幼圆;

}
#job>p{
    font-size: 18px;
    color:white;
}
.space{
    width: 100%;
    height: 4.5%;
}
#edu>h3{
    color: black;
    height: 40px;
    line-height: 40px;
    font-weight: bold;
}
#edu>p{
    color: white;
    font-size: 20px;
}
#edu>table{
    color: white;
}
.xdiv{
    overflow: hidden;
}
.xiangmu{
    transition: 0.5s ease all;
}
.xiangmu:hover{
    transform: scale(1.4,1.4);
}
.section{
    background: #234561; /* fallback for old browsers */
    background: -webkit-linear-gradient(to left, #234561 ,#182632); /* Chrome 10-25, Safari 5.1-6 */
    background: linear-gradient(to left, #234561 , #182632); /* W3C, IE 10+/ Edge, Firefox 16+, Chrome 26+, Opera 12+, Safari 7+ */
    padding-top: 70px;
}
.xdiv>h4{
    height: 30px;
    line-height: 30px;
    font-size: 25px;
    font-family: 幼圆;
    font-weight: bold;
    color: #000000;
}
.xdiv>p{
    color: white;
    font-size: 20px;
}
.tit{
    width: 100%;
    height: 10%;
}
.tit>span{
    font-size: 45px;
    line-height: 45px;
    color: white;
    font-weight: bold;
}
#tagscloud{
    width: 100%;
    height: 70%;
}
#tagscloud>span{
    text-shadow: #000000 1px 1px 1px;
    font-family: 幼圆;
}
.vertical {
    -webkit-writing-mode: vertical-rl;
}
#title{
    height: 20%;
    width: 100%;
    min-height: 150px;
}
.section4{
    padding-top: 100px;
}

.w1{
    color: white !important;
    opacity: 0.1;
}
.section5{
    padding-top: 120px;
}
#ziwo>p{
    color: white;
    font-size: 30px;
}
.section1 h3{
    opacity: 0;
    transition: 0.5s all;
}
.active h3{
    opacity: 1;
    transition-delay:0.5s;
}
.section1 h4{
    opacity: 0;
    transition: 0.5s all;
}
.active h4{
    opacity: 1;
    transition-delay:0.8s;
}
.section1 p{
    opacity: 0;
    transition: 1s all;
}
.active p{
    opacity: 1;
    transition-delay: 1s;
}
.section1 img{
    opacity: 0;
    transition: 0.7s all;
}
.active img{
    opacity: 1;
}
.section2 h3{
    opacity: 0;
    transition: 0.4s all;
}
.active h3{
    opacity: 1;
    transition-delay: 0.5s;
}
.section2 table{
    opacity: 0;
    transition: 0.5s all;
}
.active table{
    opacity: 1;
    transition-delay: 0.8s;
}
.section2 p{
    opacity: 0;
    transition: 1s all;
}
.active p{
    opacity: 1;
    transition-delay: 1.2s;
}
.section2 img{
    opacity: 0;
    transition: 1s all;
}
.active img{
    opacity: 1;
}
.section3 h4{
    opacity: 0;
    transition: 0.5s all;
}
.active h4{
    opacity: 1;
    transition-delay: 0.8s;
}
.section3 p{
    opacity: 0;
    transition: 0.9s all;
}
.active p{
    opacity: 1;
    transition-delay: 1.2s;
}
.section3 img{
    opacity: 0;
}
.active img{
    opacity: 1;
}
.section5 p{
    opacity: 0;
    transition: 1s all;
}
.active p{
    opacity: 1;
    transition-delay: 1s;
}
@media only screen and (max-width: 768px){
    #tags{
        display: block!important;
    }
    .section4{
        padding-top: 60px;
    }
    .section5{
        padding-top: 60px!important;
    }
}